<template id="store_info">
    <div class="pm-active-msg">
        <!--推荐活动-->
        <div class="pm-prize-shop-msg-wrap-wrap" v-if="pageDefault.activityModels">
            <div class="pm-positionR">
                <img class="pm-prize-active-data" v-lazy="staticImageUrl('images/shop_msg.png')" alt="" />
                <span class="pm-title">{{pageDefault.title}}</span>
            </div>
            <div class="pm-prize-shop-msg-wrap" v-for="(activityModel,index) in pageDefault.activityModels" @click="toDetail(activityModel.unionKey,activityModel.unionType)" >
                <img class="pm-prize-active-data" :src="systemImgServerCommon(activityModel.activityPhoto)" alt="海报" />
                <!--TODO 页面无法显示浏览量，真的奇怪，主要color无法修改-->
                <span class="active-common-browse-num" v-if="activityModel.vistitNum">浏览{{activityModel.vistitNum}}</span>
            </div>
        </div>
        <!--热门活动end-->
    </div>
</template>
<script>
    import UnionAct from '../../../../act/UnionAct'
    export default {
        name: 'store_info',
        props: {
            recommondActMsg: Object
        },
        data() {
            return {
                pageDefault:{
                    title:'推荐活动',
                    activityModels:[]
                },
            }
        },
        mounted: function () {
            this.pageDefault = Object.assign(this.pageDefault,this.recommondActMsg);
        },
        methods: {
            //热门活动的跳转
            toDetail: function (itemId,activitiType) {
                let that = this;
                switch (activitiType) {
                    case 'ITEM':UnionAct.toItemDetail(itemId);break;
                    case 'MARKETING':UnionAct.toMarketing(itemId);break;
                    case 'SINGLE_ACT':UnionAct.openSingleAct(itemId);break;
                    case 'NO_LINK':break;
                    default:break;
                }
            }
        }
    }

</script>
<style lang="scss" scoped>
    @import url($css_root + 'css/components/hotAct.css');
    .pm-prize-location-wrap,.pm-prize-phone-wrap{
        padding-left: .1rem;
        width: 100%;
        box-sizing: border-box;
        position: relative;
        .iconfont{
            position: absolute;
            left: 0;
        }
    }
    .icon-dianhua{
        top: .02rem;
    }
    .pm-prize-shop-msg{
        line-height: .3rem;
    }
    .pm-prize-shop-msg-wrap{
        position: relative;
    }
    .pm-prize-shop-msg-wrap{
        padding-top: .1rem;
    }
</style>
